<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
  <title>生态圈系统-操作日志</title>
  <link rel="icon" th:href="@{/images/favicon.ico}" th:mce_href="@{/images/favicon.ico}" type="image/x-icon">
  <link rel="shortcut icon" th:href="@{/images/favicon.ico}" th:mce_href="@{/images/favicon.ico}" type="image/x-icon">

  <!-- CSS  -->
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  <link href="plugins/bootstrap-4.0.0/css/bootstrap.min.css" th:href="@{/plugins/bootstrap-4.0.0/css/bootstrap.min.css}" type="text/css" rel="stylesheet"/>
  <link href="css/materialize.css" th:href="@{/css/materialize.css}" type="text/css" rel="stylesheet" media="screen,projection"/>
  <link href="plugins/perfect-scrollbar/perfect-scrollbar.css" th:href="@{/plugins/perfect-scrollbar/perfect-scrollbar.css}" type="text/css" rel="stylesheet" media="screen,projection"/>
  <link href="plugins/bootstrap-datepicker/css/bootstrap-datepicker.css" th:href="@{/plugins/bootstrap-datepicker/css/bootstrap-datepicker.css}" type="text/css" rel="stylesheet"/>
  <link href="plugins/bootstrap-sweetalert/sweetalert.css" th:href="@{/plugins/bootstrap-sweetalert/sweetalert.css}" type="text/css" rel="stylesheet"/>
  <link href="css/style.css" th:href="@{/css/style.css}" type="text/css" rel="stylesheet"/>
</head>
<body>
  <header>
    <nav class="" role="navigation" style="background-color: #f4f6f9;">
      <div class="nav-wrapper">
        <ul class="right hide-on-med-and-down">
          <!--
          <li><a class="blue-text waves-effect dropdown-trigger" href="#!" data-target="dropdown1" style="vertical-align: top;"><span th:if="${session.user!=null}" th:text="${session.user.username}">admin</span><i class="material-icons right">arrow_drop_down</i></a></li>
           -->
          <li><a class="grey-text waves-effect dropdown-trigger" href="#!" data-target="dropdown1" style="vertical-align: top;"><span sec:authentication="name">admin</span><i class="material-icons right">arrow_drop_down</i></a></li>
          <ul id="dropdown1" class="dropdown-content">
            <li><a href="#modal3" class="waves-effect grey-text modal-trigger">修改密码</a></li>
            <li><a th:href="@{/admin/logout}" class="waves-effect grey-text">退出登录</a></li>
          </ul>
        </ul>

        <a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a>
      </div>
    </nav>
  </header>

  <div th:replace="common/aside_admin :: aside"></div>

  <main class="" style="height: calc(100% - 48px); background-color: #f4f6f9;">
    <div class="row">
      <h6 style="margin: 0 0 0 15px;" id="page-title" active-menu="system-log-menu">操作日志</h6>
    </div>

    <div class="row white" style="margin: 0 15px; height: inherit;">


      <div class="col s12" style="height: inherit;"> <!-- Note that "m8 l9" was added -->
        <div class="">
          <form id="search">
            <div class="row" style="margin-bottom: 0;">
              <div class="input-field col s2 blue-text">
                <select name="activityId">
                  <option value="" selected>全部</option>
                  <option th:each="a : ${activities}" th:value="${a.id}"  th:text="${a.title}" th:selected="${a.id} == ${#request.getParameter('activityId')}"></option>
                </select>
                <label>权益</label>
              </div>
              <div class="input-field col s2 blue-text">
                <select name="opObject">
                  <option value="" selected>全部</option>
                  <option value="信托客户" th:selected="'信托客户' == ${#request.getParameter('opObject')}">信托客户</option>
                  <option value="权益" th:selected="'权益' == ${#request.getParameter('opObject')}">权益</option>
                  <option value="优惠券" th:selected="'优惠券' == ${#request.getParameter('opObject')}">优惠券</option>
                </select>
                <label>对象</label>
              </div>
              <div class="input-field col s2 blue-text">
                <select name="op">
                  <option value="" selected>全部</option>
                  <option value="新建" th:selected="'新建' == ${#request.getParameter('op')}">新建</option>
                  <option value="修改" th:selected="'修改' == ${#request.getParameter('op')}">修改</option>
                  <option value="删除" th:selected="'删除' == ${#request.getParameter('op')}">删除</option>
                  <option value="发放" th:selected="'发放' == ${#request.getParameter('op')}">发放</option>
                  <option value="导入" th:selected="'导入' == ${#request.getParameter('op')}">导入</option>
                  <option value="生成" th:selected="'生成' == ${#request.getParameter('op')}">生成</option>
                  <option value="等级变更" th:selected="'等级变更' == ${#request.getParameter('op')}">等级变更</option>
                </select>
                <label>操作</label>
              </div>
              <div class="input-field col s2">
                <input type="text" name="startDate" id="startDate" class="date-picker" th:value="${#request.getParameter('startDate')}">
                <label for="startDate">开始日期</label>
              </div>
              <div class="input-field col s2">
                <input type="text" name="endDate" id="endDate" class="date-picker" th:value="${#request.getParameter('endDate')}">
                <label for="endDate">结束日期</label>
              </div>
              <div class="input-field col s1">
                <a th:href="'javascript:search();'" class="waves-effect waves-light btn-floating search-btn"><i class="material-icons right">search</i></a>
              </div>
            </div>
          </form>
        </div>

        <div style="padding-top: 0; height: inherit;">

          <div>
            <table>
              <thead>
                <tr>
                  <!-- <th width="5%">
	                  <label>
	                    <input type="checkbox" id="select_all"/>
	                    <span></span>
	                  </label>
                  </th> -->
                  <th width="10%">操作人</th>
                  <th width="10%">对象</th>
                  <th width="10%">操作</th>
                  <th width="5%">结果</th>
                  <th width="15%">时间</th>
                  <th width="50%">详情</th>
                </tr>
              </thead>
            </table>
          </div>

          <div id="table_body_div" style="height: calc(100% - 88px); position: relative;">
            <div>
	            <table class="highlight">
	              <thead>
	                <tr>
	                  <!-- <th class="no-padding" width="5%"></th> -->
	                  <th class="no-padding" width="10%"></th>
	                  <th class="no-padding" width="10%"></th>
	                  <th class="no-padding" width="10%"></th>
	                  <th class="no-padding" width="5%"></th>
	                  <th class="no-padding" width="15%"></th>
	                  <th class="no-padding" width="50%"></th>
	                </tr>
	              </thead>
	              <tbody>
	                <tr th:each="l : ${logs}">
	                  <!-- <td>
                      <label>
	                      <input type="checkbox"/>
	                      <span></span>
	                    </label>
	                  </td> -->
	                  <td th:text="${l.opUsername}" th:title="${l.opUsername}">中秋大闸蟹</td>
	                  <td th:text="${l.opObject}" th:title="${l.opObject}"></td>
	                  <td th:text="${l.op}" th:title="${l.op}">2018-09-01</td>
	                  <td th:text="${l.opResult}" th:title="${l.opResult}">2018-09-01</td>
	                  <td th:text="${#temporals.format(l.opTime, 'yyyy-MM-dd HH:mm')}" th:title="${l.opTime}">2018-09-01</td>
	                  <td th:text="${l.opDetail}" th:title="${l.opDetail}">2018-09-30</td>
	                </tr>
	              </tbody>
	            </table>
            </div>
          </div>
          <ul class="pagination" th:if="${logs.totalPages} > 1">
            <!-- <li class="disabled"><a href="#!"><i class="material-icons">chevron_left</i></a></li>
            <li class="active"><a href="#!">1</a></li>
            <li class="waves-effect"><a href="#!">2</a></li>
            <li class="waves-effect"><a href="#!">3</a></li>
            <li class="waves-effect"><a href="#!">4</a></li>
            <li class="waves-effect"><a href="#!">5</a></li>
            <li class="waves-effect"><a href="#!"><i class="material-icons">chevron_right</i></a></li> -->
          </ul>

        </div>

      </div>

  	</div>
  </main>

  <!-- <footer class="white page-footer teal">
    <div class="footer-copyright">
      <div class="black-text container">
      Made by <a class="brown-text text-lighten-3" href="http://materializecss.com">Materialize</a>
      </div>
    </div>
  </footer> -->

  <!-- Modal Structure -->

  <div th:replace="common/update_pwd :: #modal3"></div>

  <!--  Scripts-->
  <script src="js/jquery-3.3.1.min.js" th:src="@{/js/jquery-3.3.1.min.js}"></script>
  <script src="js/materialize.js" th:src="@{/js/materialize.js}"></script>
  <script src="plugins/perfect-scrollbar/perfect-scrollbar.min.js" th:src="@{/plugins/perfect-scrollbar/perfect-scrollbar.min.js}"></script>
  <script src="plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js" th:src="@{/plugins/bootstrap-datepicker/js/bootstrap-datepicker.min.js}"></script>
  <script src="plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js" th:src="@{/plugins/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js}" charset="UTF-8"></script>
  <script src="plugins/bootstrap-sweetalert/sweetalert.min.js" th:src="@{/plugins/bootstrap-sweetalert/sweetalert.min.js}"></script>
  <script src="js/common.js" th:src="@{/js/common.js}"></script>
  <script src="js/jquery.page.js" th:src="@{/js/jquery.page.js}"></script>
  <script th:inline="javascript">
    $(".pagination").createPage({
      pageCount: [[${logs.totalPages}]],
      current: [[${logs.number}]] + 1,
      backFn:function(p){
        window.location.href = "logs?page=" + (p - 1) + "&" + formParamsSerialize($("#search").find('input, select'));
      }
    });

    function search() {
      console.log($("#search").serialize());
      window.location.href = "logs?" + formParamsSerialize($("#search").find('input, select'));
    }

  </script>
  </body>
</html>
